<template>
  <el-col>
    <el-form-item :label="`${setI18n('setting.font.label')}：`">
      <xt-radio v-model="font" @change="store.setFont" :options="fontOptions" />
    </el-form-item>
  </el-col>
</template>

<script lang="ts">
export default {
  name: "SettingFont",
};
</script>

<script lang="ts" setup>
import { ref } from "vue";
import { useLocalI18n } from "@/locales/i18n";
import useSystemStore from "@/pinia/system";

// 字体枚举数据
const fontOptions = [
  { name: "刀隶体", code: "DaoLiTi", i18n: "setting.font.DaoLiTi" },
  { name: "大楷", code: "DaKai", i18n: "setting.font.DaKai" },
  { name: "黑体", code: "HeiTi", i18n: "setting.font.HeiTi" },
  { name: "普惠体", code: "PuHuiTi", i18n: "setting.font.PuHuiTi" },
];

const { setI18n } = useLocalI18n();
const store = useSystemStore();

const font = ref(store.settingFont);
</script>
